<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" type="text/css" href="./css/index.css"/>
	<script src="./js/jquery-3.2.1.min.js"></script>
	<script src="js/echarts.min.js"></script>
	<script src="js/points.js"></script>
	<!--退出登录-->
	<script src="js/loginOut.js"></script>
    <title>个人信息</title>
	<script>
		$(function (){
			//个人信息展示
			$.get(
					"loginServlet/loginStatus",
					function (data) {
						console.log(data);
						$("#uid").val(data.uid);
						//头像
						let headerimg = data.headerimg;
						if (headerimg != null){
							$("#headerimg").attr("src","http://192.168.17.12:8060/"+headerimg);
						}

						//手机号的显示
						let tel = data.tel;
						tel = tel.substring(0,3)+"****"+tel.substring(7);
						$("#phone").text(tel);

						//昵称显示
						$("#nickname-name").text(data.nickname);

						//性别显示
						$("#selected-gender").text(data.sex);

						//邮箱显示
						$("#local-email").text(data.email);

						//用户积分展示
						$(".so").text(data.total);

						//关注数
						$("#followsum").text(data.followsum);

						//粉丝数
						$("#fansum").text(data.fansum);
					}
			);

			$("#fileInput").change(function (){
				// console.log($(this));
				let formData = new FormData;
				let file = $("#fileInput")[0].files[0];
				formData.append("file",file);
				formData.append("uid",$("#uid").val());

				$.ajax({
					url:"loginServlet/uploadHead",
					type:"POST",
					data:formData,
					processData: false, // 不处理数据
					contentType: false, // 不设置内容类型
					success:function (data) {
						alert(data.msg);
					}
				});
			});
		});
	</script>
</head>
<body>
    <header>
    	<div class="lf">
    		<a class="home" href="index.html">系统首页</a>
    		<!-- <a href="bbs.html">论坛</a> -->
    		<a href="upload.html">上传资料</a>
    	</div>
    	<div id="search">
    		<input type="text" name="name"
    			placeholder="请输入要搜索的资源" autocomplete="off"/>
			<a class="search btn">搜索</a>
    	</div>

    	<div class="rf">
    		<div class="email-info">
				<b>99</b>
				<ul class="email-list">
					<li><a href="./message.html">官方<b>0</b></a></li>
					<li><a href="./message.html">通知<b>0</b></a></li>
					<li><a href="./message.html">私信<b>0</b></a></li>
				</ul>
			</div>
    		<a class="info" href="personal.html">个人中心</a>
    		<a class="cols" href="shoucang.html">收藏</a>
    		<a class="exit">退出登录</a>
    	</div>
    </header>

	<!-- 充值窗口 -->
	<div class="cvs" id="cvs2_logon" style="display:none">

		<div class="newModWin zfb-win">
			<section class="clearfix">
				<div class="title">支付宝快速充值兑换积分</div>
				<!-- 关闭弹出层 -->
				<div class="close" id="cvs2-close"></div>
			</section>

			<div class="zfb">
				<div class="clearfix">
					<input type="number" name="money" placeholder="请输入充值金额,单位元"/>
					<input type="button" class="zfb-btn" value="充值" />
				</div>
				<b>充值比例：1元=10积分</b>
			</div>
		</div>
	</div>
	<article>
		<!-- 网站主体 -->
		<div id="main" class="clearfix">
			<!-- 定义右侧窗口信息 -->
			<section class="aside">
				<aside class="users">
					<div class="pu">
						<p class="photo">
							<input type="text" id="uid" style="display: none">
							<span class="lf">个人头像</span>
							<img class="rf" src="./images/user.jpg" id="headerimg"/>
							<!-- 单击头像，修改用户头像 -->
							<input type="file" name="" id="fileInput" accept="image/png,image/jpeg,image/jpg,image/gif">
						</p>

						<p class="tel disable" >
							<span class="lf">手机号码</span>
							<span class="rf" id="phone"></span>
						</p>

						<p class="nickname">
							<span class="lf">昵称</span>
							<span class="rf" id="nickname-name"></span>

						</p>

						<p class="sex">
							<span class="lf">性别</span>
							<span class="rf" id="selected-gender"></span>
						</p>

						<p class="email">
							<span class="lf">邮箱</span>
							<span class="rf" id="local-email"></span>
						</p>
						<a href="modifypass.html">
							<p class="password">
								<span class="lf">密码</span>
							</p>
						</a>
					</div>

				</aside>

				<!-- 修改 昵称的 窗口 -->
				<aside class="modify-win nickname">
					<div class="title"><i></i>修改-昵称</div>
					<div class="content">
						<input type="text" id="nickname" name="" value="">
						<button class="confirmbtn">确定修改</button>
					</div>
				</aside>
				<!-- 修改 性别的 窗口 -->
				<aside class="modify-win sex">
					<div class="title"><i></i>修改-性别</div>
					<div class="content">
						<input type="radio" name="sex" value="m" checked id="c-sex-m"><label for="c-sex-m">男</label>
						<input type="radio" name="sex" value="f" id="c-sex-f"><label for="c-sex-f">女</label>
						<input type="radio" name="sex" value="s" id="c-sex-s"><label for="c-sex-s">保密</label>
						<button id="modify-gender">确定修改</button>
					</div>
				</aside>
				<!-- 修改 邮箱的 窗口 -->
				<aside class="modify-win email">
					<div class="title"><i></i>修改-邮箱</div>
					<div class="content">
						<input type="text" name="" id="old-email" value="" placeholder="请输入原注册的邮箱">
						<input type="text" name="" id="new-email" value="" placeholder="请输入新的邮箱">
						<button id="modify-email">确定修改</button>
					</div>
				</aside>

				<!-- 关注数 -->
				<aside class="psl">
					<a class="focus-on" href="./attention.html">关注数:<b id="followsum"></b></a>
					<a class="fan">粉丝数:<b id="fansum"></b></a>
				</aside>

				<aside class="info">
					<h1>
						<a>用户积分:<b class="so">8</b></a>
						<a class="zfb-cz-btn" onclick="$('#cvs2_logon').show();">支付宝积分充值</a>
					</h1>
					<!-- 图表形式显示积分  -->
					<div id="user-score-mark" class="u-mark"></div>
				</aside>
			</section>
			<section>
				<h1 class="detail-score">积分明细</h1>
				<ul class="person-info">
					<li>
						<strong class="c1">资源名称</strong>
						<strong class="c2">积分变动</strong>
						<strong class="c3">原因</strong>
						<strong class="c4">时间</strong>
					</li>

					<!-- <li>
						<a>暂无数据</a>
					</li> -->
					<!--<li>
						<a class="c1 link" href="./detail.html">java项目开发文档模板</a>
						<span class="c2">-10</span>
						<span class="c3"> - 下载资源扣除积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>
					<li>
						<a class="c1 link" href="./detail.html">软件开发计划书（是 一个完整的项目开发文档）</a>
						<span class="c2">-50</span>
						<span class="c3"> - 下载资源扣除积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">jquery封装好的验证码</a>
						<span class="c2">10</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1">&lt;&lt;无资源&gt;&gt;</a>
						<span class="c2">20</span>
						<span class="c3">- 用户注册赠送积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1">&lt;&lt;无资源&gt;&gt;</a>
						<span class="c2">200</span>
						<span class="c3">- 支付宝充值获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">基于s2sh带有进度条的文件上传</a>
						<span class="c2">2</span>
						<span class="c3">- 评论资源获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Java_ME_中文帮助文档</a>
						<span class="c2">20</span>
						<span class="c3">- 用户注册赠送积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Spring Cloud 2018最新_官网文档_中文参考手册_pdf</a>
						<span class="c2">-20</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">es6标准入门（第三版）_阮一峰.pdf</a>
						<span class="c2">5</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Java_ME_中文帮助文档</a>
						<span class="c2">-5</span>
						<span class="c3">- 资源下载扣取积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Spring Cloud 2018最新_官网文档_中文参考手册_pdf</a>
						<span class="c2">-20</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">es6标准入门（第三版）_阮一峰.pdf</a>
						<span class="c2">5</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Spring Cloud 2018最新_官网文档_中文参考手册_pdf</a>
						<span class="c2">-20</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">es6标准入门（第三版）_阮一峰.pdf</a>
						<span class="c2">5</span>
						<span class="c3">- 资源被下载获得积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>

					<li>
						<a class="c1 link" href="./detail.html">Java_ME_中文帮助文档</a>
						<span class="c2">-5</span>
						<span class="c3">- 资源下载扣取积分</span>
						<span class="c4">2021-09-13 22:06:01</span>
					</li>-->

				</ul>

				<!-- 分页 -->
				<div class="pagination">
					<select>
						<option>3条/页</option>
						<option>5条/页</option>
						<option>10条/页</option>
						<option selected>15条/页</option>
					</select>
					<!--<a class="left"></a>
					<a class="act">1</a>
					<a>2</a>
					<a>3</a>
					<a>4</a>
					<a>5</a>
					<a class="right"></a>-->
					<select>
						<!--<option>1/5</option>
						<option>2/5</option>
						<option>3/5</option>
						<option>4/5</option>
						<option>5/5</option>-->
					</select>
				</div>
			</section>

		</div>
	</article>
	<footer>
		<p class="decro">本站所有资源信息均由网友上传,本站只是为了推广资源让更多读者下载,使用。如涉侵权，请联系管理员</p>
		<p class="cr">Copyright © 2021-2025 <span class="site">爱下载资源分享平台</span> All Rights Reserved.</p>
		<p class="num">沪ICP备14048333号</p>
	</footer>
	<script>
		$(function() {
			// 修改个人信息
			$(".users .pu").on("click", ".nickname, .sex, .email" , function(event){
				$(this).parents(".users").slideUp();
				let cls = this.className ;
				$(`.modify-win.${cls}`).slideDown();
			})
			// 取消修改信息效果
			$(".modify-win i").on("click", function(event){
				// console.log($(this).parents(".modify-win"))
				$(this).parents(".modify-win").slideUp()
				$("aside.users").slideDown()
			})

			$.get(
					"integralServlet/FindIntegralAll",
					function (data) {

						// console.log(data);

						var option = {
							title: {
								text: '用户积分信息-积分统计',
								left: 'center'
							},
							tooltip: {
								trigger: 'item',
								formatter: '{a} <br/>{b} : {c} ({d}%)'
							},
							legend: {
								top: 'bottom',
								data: ['支付宝充值', '用户注册', '上传资源', '评论资源', '被下载文件']
							},
							series: [
								{
									name: '积分来源',
									type: 'pie',
									radius: '50%',
									center: ['40%', '45%'],
									data: [
										{value: data.topup, name: '支付宝充值'},
										{value: data.register, name: '用户注册'},
										{value: data.upload, name: '上传资源'},
										{value: data.comment, name: '评论资源'},
										{value: data.download, name: '被下载文件'}
									],
									emphasis: {
										itemStyle: {
											shadowBlur: 10,
											shadowOffsetX: 0,
											shadowColor: 'rgba(0, 0, 0, 0.5)'
										}
									}
								}
							]
						};

						echarts.init($("#user-score-mark").get(0)).setOption(option);

					}
			);


		})




	</script>


	<script>
		//更新昵称
		$(document).ready(function() {
			//从本地存储中获取昵称
			var storedNickname = localStorage.getItem('nickname');

			if (storedNickname) {
				//如果本地存储中有昵称值，显示它
				$("#nickname-name").text(storedNickname);
			}

			$(".confirmbtn").click(function() {
				var nickname = $("#nickname").val();
				$.ajax({
					type: "get",
					url: "UpdateServlet/updateNick",
					data: { nickname: nickname },
					success: function(data) {
						if (data.code == 602) {
							// 更新昵称的值
							$("#nickname-name").text(nickname);
							// 存储昵称到本地存储
							localStorage.setItem('nickname', nickname);
							alert(data.msg);
						} else {
							alert(data.msg);
						}
					}
				});
			});
		});
	</script>



	<script>
		//更新性别
		$(document).ready(function () {

			var genderText = {
				"m": "男",
				"f": "女",
				"s": "保密"
			};

			// 给单选按钮绑定点击事件
			$("input[name='sex']").on("change", function() {
				// 获取选中的性别
				var selectedGender = $("input[name='sex']:checked").val();
				var text = genderText[selectedGender];

				// 更新当前性别显示
				$("#selected-gender").text(text);

				// 将选中的性别存储到本地存储
				localStorage.setItem('selectedGender', text);
			});

			// 初始化页面时，检查本地存储是否有选中的性别，并更新页面
			var storedGender = localStorage.getItem('selectedGender');
			if (storedGender) {
				$("input[name='sex'][value='" + storedGender + "']").prop("checked", true);
				$("#selected-gender").text(storedGender);
			}




			// 绑定点击事件到 "确定修改" 按钮
			$("#modify-gender").click(function() {
				// 获取选中的性别
				var selectedGender = $("input[name='sex']:checked").val();
				var text = genderText[selectedGender];

				$.ajax({
				    type: "post",
				    url: "UpdateServlet/updateSex", // 服务器端处理修改性别的接口
				    data: { gender: text },
				    success: function(data) {
				       if (data.code==602){
						   alert(data.msg);
					   }else{
						   alert(data.msg)
					   }
				    },
				});
			});
		});
	</script>



	<script>
		//修改邮箱
		$(document).ready(function (){
			//从本地存储中获取邮箱
			var storedEmail = localStorage.getItem('email');

			if (storedEmail) {
				//如果本地存储中有邮箱，显示它
				$("#local-email").text(storedEmail);
			}

			$("#modify-email").click(function() {
				var oldemail = $("#old-email").val();
				var newemail = $("#new-email").val();
				$.ajax({
					type: "get",
					url: "UpdateServlet/updateEmail",
					data: {oldemail:oldemail, newemail:newemail},
					success: function(data) {
						if (data.code == 602) {
							// 更新昵称的值
							$("#local-email").text(newemail);
							// 存储昵称到本地存储
							localStorage.setItem('email', newemail);
							alert(data.msg);
						} else {
							alert(data.msg);
						}
					}
				});
			});
		});
	</script>

</body>

</html>